<template>
	<view class="power-container">
		<view v-if="powerType" class="power-top">
			<text>测评箱</text>
		</view>
		
		<view v-else class="power-top-buy" >

			<text>机构用户测评特权</text>
			<view v-if="isInput" class="power-top-buy-btn" @click="vipPay()">
				机构登录
			</view>
			
			<button v-if="!isInput" class="power-top-buy-btn" plain="true" open-type="getPhoneNumber" @getphonenumber="getphonenumber">
				机构登录
			</button>
		</view>
		<view class="power-view" v-if="vipLevel === 0" :class="{'power-view-box-shadow':!powerType}">
			<view style="display: flex;flex-direction: row;justify-content: space-around;width: 100%;">
				<view class="suggest-buy-p">
					<image class="suggest-buy-p-img" style="width: 52rpx;height: 58rpx;" src="../static/assess-result-vip-p1.png"></image>
					<view class="suggest-buy-info-view">
						<text class="power-name">无限空间</text>
						<text class="power-desc">无限次使用测评</text>
					</view>
				</view>
				<view class="suggest-buy-p">
					<image class="suggest-buy-p-img" style="width: 56rpx;height: 56rpx;" src="../static/assess-result-vip-p2.png"></image>
					<view class="suggest-buy-info-view">
						<text class="power-name">专业数据</text>
						<text class="power-desc">专家结论自动生成</text>
					</view>
				</view>
			</view>
			<view style="margin-top: 40rpx;display: flex;flex-direction: row;justify-content: space-around;width: 100%;">
				<view class="suggest-buy-p">
					<image class="suggest-buy-p-img" style="width: 38rpx;height: 56rpx;" src="../static/assess-result-vip-p3.png"></image>
					<view class="suggest-buy-info-view">
						<text class="power-name">便捷操作</text>
						<text class="power-desc">无需线下培训</text>
					</view>
				</view>
				<view class="suggest-buy-p" style="justify-self: flex-start;">
					<image class="suggest-buy-p-img" style="width: 42rpx;height: 50rpx;" src="../static/assess-result-vip-p4.png"></image>
					<view class="suggest-buy-info-view">
						<text class="power-name">纸质报告</text>
						<text class="power-desc">打印、保存、分享</text>
					</view>
				</view>
			</view>
			
			<!-- <view v-if="powerType" class="assess-result-g" @click="seeAssessClick">查看示例报告</view> -->
		</view>
	</view>
</template>

<script>
	import utils from '../utils/utils.js'
	export default {
		
		props: {
			powerType: {
				type: Boolean,
				default: true
			},
			evaluateRecordId: {
				type: String,
				default: '',
			}
		},

		data() {
			return {
				// showBuy: false,
				///手机是否已保存
				isInput: false,
				
				vipLevel: 0,
			};
		},
		
		created(){
			console.log(getApp().globalData.user.mobile);
			if (!utils.isEmpty(getApp().globalData.user.mobile)){
				this.isInput = true;
			}
			uni.$on('event_refresh_user', this.init)
			this.init();
		},

		methods:{
			init() {
				this.vipLevel = getApp().globalData.user.org.vipLevel;
				if (utils.isEmpty(this.vipLevel)){
					this.vipLevel = 0;
				}
			},
			
			vipPay() {
				uni.navigateTo({
					url:'/pages-assess/vip-pay/vip-pay?evaluateRecordId=0'
				})
			},
			
			getphonenumber(e){
				console.log(e);
				if (e.detail.errMsg == "getPhoneNumber:ok") {
					this.getPhone(e.detail.encryptedData,e.detail.iv)
				}else{
					uni.showToast({
						title:'获取手机失败!',
						icon:'none'
					})
				}
			},
			
			getPhone(encryptedData,iv){
				console.log(encryptedData);
				console.log(iv);
				console.log(getApp().globalData.session.sessionKey);
				uni.showLoading({}) 
				this.$http.request({
					method:'GET',
					url:'/wx/user/'+getApp().globalData.appid+'/wxphone',
					data:{
						appid:getApp().globalData.appid,
						encryptedData:encryptedData,
						iv:iv,
						sessionKey:getApp().globalData.session.sessionKey,
					}
				}).then(res=>{
					console.log(res);
					uni.hideLoading();
					if (res.code === '000000'){
						this.vipPay()
					}else{
						uni.showToast({
							title:res.msg,
							icon:'none'
						});
					}
				}).catch(err=>{
					console.log(err);
					uni.hideLoading();
					uni.showToast({
						title:err,
						icon:'none'
					});
				})
			},
			
			seeAssessClick(){
				console.log(this.evaluateRecordId);
				uni.navigateTo({
					url:'/pages-assess/assess/assess-result/assess-result?evaluateRecordId='+this.evaluateRecordId+'&isShared=true'
				})
			},
		}
	}
</script>

<style lang="scss">
	.power-container {
		/* width: 670rpx; */
		/* align-self: stretch; */
		/* position: relative; */
	}

	.power-top {
		/* width: 670rpx; */
		height: 100rpx;
		background: linear-gradient(360deg, rgba(255, 235, 155, 1) 0%, rgba(229, 187, 79, 1) 100%);
		opacity: 1;
		border-radius: 8rpx 8rpx 0px 0px;
		display: flex;
		flex-direction: row;
		justify-content: center;
		align-items: center;

		font-size: 30rpx;
		font-weight: bold;
		color: rgba(111, 79, 40, 1);
		opacity: 1;
		box-shadow:0px 3px 6px rgba(0,0,0,0.16);
		
		@include power-bg();
	}
	
	.power-top-buy {
		/* width: 670rpx; */
		height: 100rpx;
		background: linear-gradient(360deg, rgba(255, 235, 155, 1) 0%, rgba(229, 187, 79, 1) 100%);
		opacity: 1;
		border-radius: 8rpx 8rpx 0px 0px;
		display: flex;
		flex-direction: row;
		justify-content: space-between;
		align-items: center;
	
		font-size: 30rpx;
		font-weight: bold;
		color: rgba(111, 79, 40, 1);
		opacity: 1;
		padding-left: 20rpx;
		padding-right: 20rpx;
		
		@include power-bg();
	}
	
	.power-top-buy-btn{
		
		height:30px;
		border:1px solid rgba(111,79,40,1);
		opacity:1;
		border-radius:4px;
		display: flex;
		justify-content: center;
		align-items: center;
		
		padding-left: 12rpx;
		padding-right: 12rpx;
		
		font-size:24rpx;
		font-weight:bold;
		line-height:17px;
		color:rgba(111,79,40,1);
		opacity:1;
	}

	.power-view {
		/* width: 670rpx; */
		display: flex;
		flex-direction: column;
		align-items: center;
		border-radius: 5rpx;
		background-color: #FFFFFF;
		border-radius: 0px 0px 8rpx 8rpx;
		padding-top: 30rpx;
		padding-bottom: 30rpx;
		
		box-shadow:0px 3px 6px rgba(0,0,0,0.16);
		
		position: relative;
	}
	
	
	.power-view-box-shadow{
		box-shadow:0px 0px 0px rgba(0,0,0,0.16);
	}

	.suggest-buy-p {
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: center;
		flex: 1;
	}

	.suggest-buy-p-img {
		width: 120rpx;
		height: 120rpx;
	}
	
	.suggest-buy-info-view{
		display: flex;
		flex-direction: column;
		margin-left: 18px;
	}

	.power-name {
		height: 34rpx;
		font-size: 24rpx;
		font-weight: bold;
		line-height: 34rpx;
		color: #333333;
		opacity: 1;
	}

	.power-desc {
		height: 28rpx;
		font-size: 20rpx;
		font-weight: 400;
		line-height: 28rpx;
		color: #999999;
		opacity: 1;
	}
	
	.assess-result-g{
		height:35px;
		background:rgba(255,171,0,1);
		opacity:1;
		border-radius:4px;
		padding-left: 10rpx;
		padding-right: 10rpx;
		
		display: flex;
		justify-content: center;
		align-items: center;
		
		color: #FFFFFF;
		font-size: 24rpx;
		
		position: absolute;
		bottom: 30rpx;
		right: 30rpx;
	}
</style>
